import { collect } from "collect.js";
import dynamic from "next/dynamic";
import React, { useMemo } from "react";

// const RenderList = [
//     {
//         types:[],
//         component:dynamic(()=>import("."))
//     }
// ]
const RenderList = [
    {
        types:['reference'],
        Component:dynamic(()=>import('./templates/Reference'))
    }
]

const RenderInput = ({ flowInputList ,nodeId}: any) => {
    // collect(flowInputList).all()

    // const copyInputs =  JSON.parse(JSON.stringify(flowInputList));
    // // const filterInputs = JSON.parse(copyInputs);
    // // console.log('filterInputs',filterInputs)

    // const RenderCommonOutputs = useMemo(()=>{

    // },[copyO])




    // const filterInputs = useMemo(() => {
    //     const parseSortInputs = JSON.parse(copyInputs);
    //     return parseSortInputs.filter((input:any) => {
    //         const renderType = input.renderTypeList?.[input.selectedTypeIndex || 0];
    //         const RenderComponent = (() => {
    //             // if (renderType === FlowNodeInputTypeEnum.custom && memoCustomComponent[input.key]) {
    //             //     return <>{memoCustomComponent[input.key]({ ...input })}</>;
    //             // }
    //             const Component = RenderList.find((item) => item.types.includes(renderType))?.Component;
    //             if (!Component) return null;
    //             return <Component inputs={filterInputs} item={input} nodeId={nodeId} />;
    //         })();
    //         return true;
    //     });
    // },[]);
    // const Render = useMemo(() => {
    //     return filterInputs.map((input) => {
    //         return <div>RenderInput</div>;
    //     });
    // }, [flowInputList]);
    return <>111</>;
};

export default React.memo(RenderInput);
